<!DOCTYPE html>
<html>

	<head>
		<title>平涛</title>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
		
		
		<!--新增2017-03-02-->
        <script src="__PUBLIC__/Wechat/js/jquery.1.7.2.min.js"></script>
        <script src="__PUBLIC__/Wechat/js/mobiscroll_002.js" type="text/javascript"></script>
        <script src="__PUBLIC__/Wechat/js/mobiscroll_004.js" type="text/javascript"></script>
        <link href="__PUBLIC__/Wechat/css/mobiscroll_002.css" rel="stylesheet" type="text/css">
        <link href="__PUBLIC__/Wechat/css/mobiscroll.css" rel="stylesheet" type="text/css">
        <script src="__PUBLIC__/Wechat/js/mobiscroll.js" type="text/javascript"></script>
        <script src="__PUBLIC__/Wechat/js/mobiscroll_003.js" type="text/javascript"></script>
        <script src="__PUBLIC__/Wechat/js/mobiscroll_005.js" type="text/javascript"></script>
        <link href="__PUBLIC__/Wechat/css/mobiscroll_003.css" rel="stylesheet" type="text/css">
		

			<link rel="stylesheet" href="__PUBLIC__/lib/weui.min.css">
			<link rel="stylesheet" href="__PUBLIC__/css/jquery-weui.css">
			<link rel="stylesheet" type="text/css" href="__PUBLIC__/css/style.css">
			<link rel="stylesheet" type="text/css" href="__PUBLIC__/css/aui-iconfont.css">
			<style type="text/css">
				a {
					color: red
				}
				
				.b-t {
					border-bottom: 1px solid #d9d9d9;
					padding-top: 10px;
				}
				/*.weui_input{width: 85% !important}*/
				
				.aui-icon-refresh {
					color: #FFA726
				}
				
				.line-h1 {
					line-height: 1 !important
				}
			</style>
	</head>

	<body ontouchstart>
		

		<div class="weui_tab">
			<div class="weui_navbar weui_navbar1">
				<div class="weui_navbar_item weui_bar_item_on">
					<div style="text-align:left;float:left">
						<a href='javascript:history.go(-1)' onclick='back()'>
							<span class="aui-iconfont aui-icon-left"></span>
						</a>
					</div>
					<span>外勤签到</span>
					<div class="f-r">
						<a class="f-s1" href='{:U("Waiqin/index")}'>外勤记录</a>
					</div>
				</div>
			</div>
			
			<div class="weui_tab_bd">
				<div class="weui_cells_form">
					<div class="weui_cell">
						<div class="weui_cell_hd"><label for="time" class="weui_label">时间</label></div>
						<div class="weui_cell_bd weui_cell_primary">
							<input class="weui_input" id="time" type="text" value="">
						</div>
					</div>
					<div class="weui_cell">
						<div class="weui_cell_hd"><label for="" class="weui_label ">签到地点</label></div>
						<div class="weui_cell_bd weui_cell_primary">
							<input class="weui_input weui_input1 color1" id="address_in" value="正在定位中……" disabled="">
							<input type="hidden" value="" id="lat_in">
							<input type="hidden" value="" id="lng_in">
							<span class="aui-iconfont aui-icon-refresh line-h1" id="hid1" onclick="getInLocation()"></span>
						</div>
					</div>
					<div class="weui_cell">
						<div class="weui_cell_hd"><label for="" class="weui_label">签退地点</label></div>
						<div class="weui_cell_bd weui_cell_primary">
							<input class="weui_input weui_input1 color1" id="address_out" value="正在定位中……" disabled="">
							
							<span class="aui-iconfont aui-icon-refresh line-h1" id="hid2" onclick="getOutLocation()"></span>
						</div>
					</div>
					<div class="weui_cell">
        <div class="weui_cell_hd"><label for="name" class="weui_label">选择客户</label></div>
        <div class="weui_cell_bd weui_cell_primary">
          <input class="weui_input" id="job" type="text" value="" placeholder="点击选择客户">
        </div>
      </div>
				</div>
				<div class="weui_cells_title">沟通内容</div>
				<form id="talk_content" onSubmit = "return false">

				
				<div class="weui_cell  input_box">
					<div class="weui_cell_hd"><label for="" class="weui_label lab1">1.</label></div>
					<div class="weui_cell_bd weui_cell_primary">
						<textarea class="weui_textarea textarea_1" name="content[0]" id="nr" placeholder="请输入内容" rows="3"></textarea>
					</div>
				</div>
				<!--<div class="weui_cell  input_box">
					<div class="weui_cell_hd"><label for="" class="weui_label lab1">2.</label></div>
					<div class="weui_cell_bd weui_cell_primary">
						<textarea class="weui_textarea textarea_1" name="content[1]" placeholder="请输入内容" rows="1"></textarea>
					</div>
				</div>
				<div class="weui_cell  input_box">
					<div class="weui_cell_hd"><label for="" class="weui_label lab1">3.</label></div>
					<div class="weui_cell_bd weui_cell_primary">
						<textarea class="weui_textarea textarea_1" name="content[2]" placeholder="请输入内容" rows="1"></textarea>
					</div>
				</div>-->
				<div class="new_1 weui_cell_t">
					<a href="#" onclick="add()" class="a_c">新增一行 +</a>
				</div>
				<div class="weui_cell">
					<div class="weui_cell_hd"><label for="time2" class="weui_label">下次拜访时间</label></div>
					<div class="weui_cell_bd weui_cell_primary">
						<input class="weui_input" id="time2" name="appoint_time" type="text" value="" placeholder="选择下次拜访时间">
					</div>
				</div>
				<input type="hidden" value="" name="list_id" id="resID" />
				<input type="hidden" value="" name="lat_out" id="lat_out" />
				<input type="hidden" value="" name="lng_out" id="lng_out" />
				<input type="hidden" value="" name="address_out" id="address_out_2" />
				</form>
				<!--修改-->
				<div class=" weui_cells_form weui_cell_t height1" style="position: relative;">
				    <!--新增id-->
					<button class="circle1" id="Sign_in">  <span class="p-l1" id='show-loading'>签到</span> </button>
					<button class="circle2" id="Sign_out" disabled> <span class="p-l1" id='show-loading1'>签退</span> </button>
					<button class="circle1 circle3 left" style="background:rgba(128,128,105,0.2);position:absolute;left:0px;display:none"></button>
					<button class="circle1 circle3 right" style="background:rgba(128,128,105,0.2);position:absolute;right:80px"></button>
				</div>
			</div>
			
        	<include file="Index/footer" />

			<!-- <div class="weui_tabbar weui_tabbar1">
				<a href="{:U('Index/index')}" class="weui_tabbar_item ">
					<div class="weui_tabbar_icon">
						<span class="weui_tabbar_label aui-iconfont aui-icon-home "></span>
					</div>
					<p class="weui_tabbar_label ">首页</p>
				</a>
				<a href="{:U('H5/Waiqin/waiqin')}" class="weui_tabbar_item">
					<div class="weui_tabbar_icon">
						<span class="weui_tabbar_label aui-iconfont aui-icon-friend active"></span>
					</div>
					<p class="weui_tabbar_label active">外勤拜访</p>
				</a>
				<a href="{:U('Work/index')}" class="weui_tabbar_item">
					<div class="weui_tabbar_icon">
						<span class="weui_tabbar_label aui-iconfont aui-icon-edit"></span>
					</div>
					<p class="weui_tabbar_label ">工作总结</p>
				</a>
			</div> -->
		</div>
		
		

		<!--<script src="__PUBLIC__/Wechat/js/jquery-2.1.4.js"></script>-->
		<script src="__PUBLIC__/Wechat/js/fastclick.js"></script>
		<!--<script src='__PUBLIC__/js/autosize.js'></script>-->

		<script src="__PUBLIC__/Wechat/js/jquery-weui.js"></script>
		<script src="http://res.wx.qq.com/open/js/jweixin-1.1.0.js"></script>
		<!--新增加载js-->
		<script>
    //   $(document).on("click", "#show-toast", function() {
    //     $.toast("选择成功", function() {
    //       console.log('close');
    //     });
    //   })
    //   .on("click", "#show-loading", function() {
    //     $.showLoading("正在签到");

    //     setTimeout(function() {
    //       $.hideLoading();
    //     }, 3000)
    //   })
    //   .on("click", "#show-loading1", function() {
    //     $.showLoading("正在签退");

    //     setTimeout(function() {
    //       $.hideLoading();
    //     }, 3000)
    //   });
    </script>
		<script>
		
		function showLoading(){
		    
		    $.showLoading('签到中……');
		    
		    
		}
		
			// 添加新行
		

			$(function() {
				FastClick.attach(document.body);
			});
// 			autosize(document.querySelectorAll('textarea'));

			function add() {
				console.log('dadasdsa');
				var len = $('.input_box').length + 1;
				// 修改
				var content = '<div class="weui_cell input_box"><div class="weui_cell_hd"><label for="" class="weui_label lab1">' + (len) + '.</label></div><div class="weui_cell_bd weui_cell_primary"><textarea class="weui_textarea textarea_1" name="content['+ (len-1) +']" placeholder="请输入内容" rows="3"  data-autosize-on="true"></textarea></div></div>';
				$('.input_box:last').after(content);
				$('#num').val(len);
			}

			$("#Sign_in").click(function() {
				
				var address_in,lat_in,lng_in,visit_time,rowID,clientID;
				location_in = $('#address_in').val();
				lat_in = $('#lat_in').val();
				lng_in = $('#lng_in').val();
				visit_time = $('#time').val();
				rowID = $('#resID').val();
				clientID = $('#job').data('values');
				if(!lat_in || !lng_in || !location_in){
					//提示     ：   定位失败，请刷新		
					alert('位置获取失败。请重新定位');
					
					return false;
					
				}
				
				if(!visit_time){
					//提示  ：   拜访时间为空
					$.alert('拜访时间为空');
					return false;
				}
				if(!clientID){
					//提示：kehuID为空
					$.alert('请选择客户');
					return false;
				}else{
				    //alert('签到成功');
				}
				
				if(lat_in && lng_in && location_in){
					var data = {address_in:location_in,lng_in:lng_in,lat_in:lat_in,visit_time:visit_time,clientID:clientID};
					$.ajax({
					url:'{:U("Waiqin/signIn")}',
					data:data,
					dataType:'json',
					type:'post',
					beforeSend:showLoading(),
					success:function(data){
						if(data.code == 200){
						    
							$('#Sign_in').attr('disabled',true);
				// 			签到按钮加遮罩  禁用按钮的效果
							$('.circle3.right').css('display','none');
							$('.circle3.left').css('display','block')
							$('#resID').val(data.rowId);
							$('#job').attr('disabled','true');
							$('#hid1').hide();
							$('#Sign_out').attr('disabled',false);
				// 			签到成功效果 隐藏签到中提示  显示签到成功提示
							$.hideLoading();
							$.toast('签到成功');
						}else{
							//weui 信息提示
							$.alert('签到失败');
							return false;
						}
					}
				})
					
				}else if(rowID){
					//提示已经提交
					alert('签到成功');
				}
				
				
				
				
				
			});
			$("#Sign_out").click(function() {
				var listId = $('#resID').val();				
				if(!listId){
					//提示    ：
					return false;
				}				
				var content = $('form#talk_content').serialize();
				console.log(content);
				
//				var indess = $('[name^=content]');
//				var str = '';
//				indess.each(function(i, n) {
//					str += $(n).val();
//					str += ',';
//				});
//				str = str.substr(0,str.length - 1);
				var address_out = $('#address_out_2').val();
				var lat_out = $('#lat_out').val();
				var lng_out = $('#lng_out').val();				
				var appoint_time = $('#time2').val();
				var nrID = $('#nr').val();
				if(!lat_out || !lng_out|| !address_out){
					//提示     ：   定位失败，请刷新		
					$.alert('位置获取失败。请重新定位');
					return false;					
				}

				if(!nrID){
					//提示：kehuID为空
					$.alert('请填写沟通内容');
					return false;
				}
				
				if(!appoint_time || appoint_time == ' '){
					//提示  ：   拜访时间为空
					$.alert('下次拜访时间为空');
					return false;
				
				}else{
				    //alert('签到成功');
				}
//				var content = str;	
				if(lat_out && lng_out &&address_out){			
    				var post_data = {list_id:listId,appoint_time:appoint_time,address_out:address_out,lat_out:lat_out,lng_out:lng_out,content:content,nrID:nrID};
    				$.ajax({
    					url:'{:U("Waiqin/signOut")}',
    					type:'post',
    					data:content,
    					dataType:'json',
    					success:function(json){
    					    //alert(json[0]['fid']);
    					    if(json.code == 200){
        					    $('#nr').attr({'readonly':'true'});
        					    $('.a_c').css('visibility','hidden');
        					    $('#time2').attr({'disabled':'true'});
        					    $('.circle2').attr({'disabled':'true'});
        					   // $('.circle2').css({'background':'rgba(255,255,255,0.2)','position':'absolute','left','0px;','right','0px'});
        					   $('.circle3.right').css('display','block');
        					    $('#hid2').hide();
        					    $.toast('签退成功');
        					    window.location.replace('{:U("Waiqin/index")}');
    					    }
    					}
    				})
				}		
				
				
			
			});
			
			
			
			
			
			wx.config({
				debug: false, 
				appId: 'wx1b36a1a7fe5ed7e1', 
				timestamp: {$sign.timestamp}, 
				nonceStr: '{$sign.nonceStr}', 
				signature: '{$sign.signature}', 
				jsApiList: [
					'openLocation', 'getLocation'
				] 
			});

			wx.ready(function() {
				getInLocation();
				setTimeout(function(){getOutLocation()},1000)
				//getOutLocation();

			})
			
			function showLoadingMsg(Msg){
			    $.showLoading(Msg);
			}
			function closeLoading(){
			    $.hideLoading();
			}

			function getInLocation() {
			    showLoadingMsg('定位中……');
				wx.getLocation({
					type: 'wgs84',
					success: function(res) {
					    closeLoading();
						
				$.ajax({
					url: '{:U("Api/Common/getaddress",array("t"=>rand()))}',
					data: { loc: res.latitude + "," + res.longitude },
					type: 'get',
					dataType: 'json',
					success: function(data) {
						if(data.status == 0) {
							 $('#address_in').val(data.result.address);
						}
					}
				})
				
						   							
						   $('#lat_in').val(res.latitude);
						   $('#lng_in').val(res.longitude);
						   getClientByLoc(res.latitude, res.longitude);
						
					}
				});
			}

			function getOutLocation() {
			    showLoadingMsg('定位中……');
				wx.getLocation({
					type: 'wgs84',
					success: function(res) {
					    closeLoading();
						$.ajax({
					url: '{:U("Api/Common/getaddress")}',
					data: { loc: res.latitude + "," + res.longitude },
					type: 'get',
					dataType: 'json',
					success: function(data) {
						if(data.status == 0) {
							 $('#address_out').val(data.result.address);
							 $('#address_out_2').val(data.result.address);
						}
					}
				})
				
						   							
						   $('#lat_out').val(res.latitude);
						   $('#lng_out').val(res.longitude);
						   //getClientByLoc(res.latitude, res.longitude);
						
					}
				});
					
			}
			

//			function GetAddressByLoc(res) {
//				$.ajax({
//					url: '{:U("Api/Common/getaddress")}',
//					data: { loc: res.latitude + "," + res.longitude },
//					type: 'get',
//					dataType: 'json',
//					success: function(data) {
//						if(data.status == 0) {
//							$('#address_in').val(data.result.address);
//							$('#lat_in').val(data.result.location.lat);
//							$('#lng_in').val(data.result.location.lng);
//							getClientByLoc(data.result.location.lat, data.result.location.lng);
//
//						}
//
//					}
//
//				})
//			}

			function getClientByLoc(lat, lng) {
				$.ajax({
					url: '{:U("Waiqin/getClient")}',
					type: 'post',
					data: { lat: lat, lng: lng },
					dataType: 'json',
					success: function(res) {
						var str ="[";
						$.each(res,function(i,n){
								str += '{"title":"'+n.client_name+'&nbsp; &nbsp;&nbsp;&nbsp;'+ n.location + '","value":"'+ n.id+'"},';						
						})
						
						str = str.substr(0,str.length -1);
						str+="]";
						Doclient(JSON.parse(str))
						

					}

				})

			}
		</script>

		<script>
			function Doclient(res){
				$("#job").select({
				title: "选择客户",
				items: res
			});
				
			}

			
//			$('#Sign_in').click(function() {
//				
//				//console.log(str)
//			})
// 			$("#time").datetimePicker({
// 				title: '出发时间',
// 				min: "2017-01-01",
// 				//max: "2022-12-12 12:12",
// 				onChange: function(picker, values, displayValues) {
// 					console.log(values);
// 				}
// 			});
            $("#time").datetimePicker({
                container: '#time-container',
                onChange: function (picker, values, displayValues) {
                console.log(values);
                }
            });
            
            // 新增2017-03-02
             $(function () {
            var currYear = (new Date()).getFullYear();  
            var dateSelected=new Date();
            var opt={};
            opt.date = {preset : 'date'};
            opt.datetime = {preset : 'datetime'};
             opt.time = {preset : 'time'};
            opt.default = {
                theme: 'android-ics light', //皮肤样式
                    display: 'modal', //显示方式 
                    mode: 'scroller', //日期选择模式
                dateFormat: 'yyyy-mm-dd',
                lang: 'zh',
                showNow: false,
                nowText: "今天",
                    startYear: currYear - 10, //开始年份
                    endYear: currYear + 10, //结束年份
                    // maxDate:new Date(),
                    minDate:new Date(dateSelected.getTime()+24*60*60*1000)
            };
    
            $("#time2").mobiscroll($.extend(opt['date'], opt['default']));
            var optDateTime = $.extend(opt['datetime'], opt['default']);
            var optTime = $.extend(opt['time'], opt['default']);
            $("#appDateTime").mobiscroll(optDateTime).datetime(optDateTime);
            $("#appTime").mobiscroll(optTime).time(optTime);
            });
            
            
            
            
            // 注释2017-03-02
// 			$("#time2").datetimePicker({
// 			    min: new Date(),
//             times: function () {
//                 return [
//                 // {
//                 //   values: (function () {
//                 //     var hours = [];
//                 //     for (var i=0; i<24; i++) hours.push(i > 9 ? i : '0'+i);
//                 //     return hours;
//                 //   })()
//                 // },
//                 // {
//                 //   divider: true,  // 这是一个分隔符
//                 //   content: '时'
//                 // }
//                     ];
//                 },
//                 onChange: function (picker, values, displayValues) {
//                     console.log(values);
//                 },
//             });
            
// 			$("#time2").datetimePicker({
// 				min: "2017-01-01",
// 				times: function() {
// 					return [
						
// 					];
// 				},
// 				onChange: function(picker, values, displayValues) {
// 					console.log(values);
// 				},
// 			});
// 			$("#time-inline").datetimePicker({
// 				container: '#time-container',
// 				onChange: function(picker, values, displayValues) {
// 					console.log(values);
// 				}
// 			})
		</script>
		<script>
			// $("#showTooltips").click(function() {
			//   var tel = $('#tel').val();
			//   var code = $('#code').val();
			//   if(!tel || !/1[3|4|5|7|8]\d{9}/.test(tel)) $.toptip('请输入手机号');
			//   else if(!code || !/\d{6}/.test(code)) $.toptip('请输入六位手机验证码');
			//   else $.toptip('提交成功', 'success');
			// });
		</script>
	</body>

</html>